<!DOCTYPE html>
<html>
<% var title = 'add' %>
<% include head %>
<body>
  <div class="container">
    <%- include("./header.ejs") %>
    <div class="form-container">
      <form method="post" action="/user" id="addForm">
        <div class="form-group">
          <label for="exampleInputEmail1">name</label>
          <input type="text" class="form-control" name="name" placeholder="name">
        </div>
        <div class="form-group">
          <label for="exampleInputPassword1">like</label>
          <input type="text" class="form-control" name="like" placeholder="like">
        </div>
        <button type="submit" class="btn btn-default">Submit</button>
      </form>
    </div>
    <%- include("./footer.ejs") %>
  </div>
  <script>
    $(function(){
      $('#addForm').on('submit', function(e){
        e.preventDefault();
        var action = $(this).attr('action');
        var $container = $(this).closest('.form-container');
        $.ajax({
          url: action,
          type: 'POST',
          data: $('#addForm').serialize(),
          success: function(data){
            if(data.result){
              $container.html('<h2>添加成功，请到<a href="/list">列表页</a>查看</h2>');
            } else {
              alert(data.message);
            }
          },
          error: function(){
            $container.html('发生了另一些意外');
          }
        });
      });
    })
  </script>
</body>

</html>